<template>
    <div class="Order">
        <TopBar class="t" :title="'我的订单'" :url="'/index/my'"></TopBar>
        <div class="title">
            <h2>订单时间</h2>
            <h2>所有</h2>
        </div>
        <ul>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
            <router-link to="">
                <li>
                    <div class="li-1">
                        <span>10-18</span>
                        <p>16:00</p>
                    </div>
                    <div class="li-2">
                        <span>课程购买</span>
                        <p>订单号: 201901181600001</p>
                    </div>
                    <div class="li-3">
                        -199.00
                    </div>
                </li>
            </router-link>
        </ul>
    </div>
</template>

<script>
    import TopBar from "../../../component/TopBar";

    export default {
        name: "Order",
        data() {
            return {}
        },
        components: {
            TopBar
        },
        methods:{
           async aaaaa(){
                await this.$http.post('my',{
                    username:'111',
                    password:'123456',
                    telephone:12345,
                    money:123000
                })
            }
        }
    }
</script>

<style lang="stylus" scoped>
    @import "../../../assets/stylus/border.styl"
    .Order
        ul
            li
                display flex
                padding 0.12rem
                border_1px(0 0 1px 0, #dddddd)

                .li-1
                    flex 1.5
                    span
                      color black
                      font-size 0.13rem
                    p
                      padding-top 0.03rem
                      color #cccccc
                      font-size 0.12rem

                .li-2
                    flex 10
                    padding-left 0.2rem

                    span
                      color black

                    p
                      color #cccccc


                .li-3
                    padding-top 0.15rem
                    flex 1
                    color red

        .title
            padding 0.15rem
            font-weight 900
            display flex
            justify-content space-between
            border_1px(0 0 1px 0, #dddddd)

        .t
            padding 0.12rem 0.12rem 0.35rem 0.12rem
            border_1px(0 0 1px 0, #dddddd)

        img
            width 0.5rem
            height 0.5rem
            margin-right 0.05rem
            flex 1

        span
            font-size 0.12rem
            color #cccccc
            margin-top 0.1rem
            flex 2

        .content
            padding 0.15rem 0.15rem 0 0.15rem
            border_1px(0 0 1px 0, #dddddd)
            display flex

            div
                flex 7

            h3
                font-size 0.13rem
                margin-top 0.06rem

            p
                font-size 0.12rem
                color #cccccc
                margin-top 0.04rem
</style>